<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">

<head>
    <meta charset="UTF-8">
    <title>编辑账户</title>
    <meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
    <meta http-equiv="Cache-Control" content="no-siteapp" />
    <link rel="stylesheet" href="/css/bootstrap.min.css">
    <link rel="stylesheet" href="/js/laypage/skin/laypage.css">
    <link rel="stylesheet" href="/lib/layui/css/layui.css"  media="all">
    <script type="text/javascript" src="/lib/layui/layui.js"></script>
    <script src="/Vue/vue.min.js"></script>
    <script src="/js/jquery/jquery.min.js"></script>
    <script src="/js/laypage/laypage.js" charset="utf-8"></script>
    <script src="/js/layer/layer.js" charset="utf-8"></script>
</head>
<body>
    <form id="updateAccountForm" class="layui-form" action="" data-validator-option="{theme:'simple_right'}">
        <br/>
        <div >
            <label for="zhanghu">账户名称：</label>
            <input type="text" class="form-control"  id="zhanghu" name="zhanghu" th:value="${sellaccount.saName}">
            <input type="hidden" id="ids" th:value="${sellaccount.id}">
        </div>
        <div class="form-group">
            <label for="sabank">开户银行：</label>
            <input type="text" class="form-control" id="sabank" name="sabank" th:value="${sellaccount.saBank}" >
        </div>
        <div class="form-group">
            <label for="sabanknumber">银行账号：</label>
            <input type="text" class="form-control" id="sabanknumber" name="sabanknumber" placeholder="银行账号18-21位" th:value="${sellaccount.saBankNumber}" ><span id="editaccount"></span>
        </div>
        <div class="form-group">
            <label for="beginbalance">期初余额：</label>
            <input type="text" class="form-control" id="beginbalance" name="beginbalance" th:value="${sellaccount.saBeginBalance}" ><span id="editbgbalance"></span>
        </div>
        <div class="form-group">
            <label for="zhangbalance">账户余额：</label>
            <input type="text" class="form-control" id="zhangbalance" name="zhangbalance"  th:value="${sellaccount.saBalance}"><span id="editzhbalance"></span>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">状态</label>
            <div class="layui-input-block">
                <input type="checkbox" id="sysData"  th:value="${sellaccount.saState}" name="sysData" lay-skin="switch" lay-filter="switchTest" lay-text="正常|禁用" checked="">
            </div>
        </div>
        <div class="form-group">
            <button type="button" id="updateBtn" class="btn btn-success">修改</button>
            <button type="button" id="cancelBtn" class="btn btn-default">取消</button>
        </div>

    </form>

<script>
    var updateAccount = function () {
        $.ajax({
            type: 'GET',
            dataType: 'json',
            url: "/basicdata/settlement-account/updateAccount",
            data: {
               id:$("#ids").val(),
                zhanghu: $("#zhanghu").val(),
                sabank: $("#sabank").val(),
                sabanknumber: $("#sabanknumber").val(),
                beginbalance: $("#beginbalance").val(),
                zhangbalance: $("#zhangbalance").val(),
                zhangstate: $("input:checkbox[name='sysData']:checked").val()=='正常' ? '正常':'禁用',
            },
            success: function (msg) {
                $("#cancelBtn").click();
            }
        });
    }
    $("#updateBtn").click(function () {
        updateAccount();
    });
    $("#cancelBtn").click(function () {
        var index = parent.layer.getFrameIndex(window.name);
        parent.getAccountPageList ();
        parent.layer.close(index);

    });
    //验证银行账号
    var chechaccountnumber=false;
    $(function () {
        $("#sabanknumber").on("blur", function () {
            var sabanknumber = $("#sabanknumber").val();
            var reg = /[0-9]{18,21}/;
            var b = reg.test(sabanknumber);
            if (b) {
                $.ajax({
                    type:"post",
                    url: "/basicdata/settlement-account/checkaccount",
                    data: {
                        "sabanknumber": sabanknumber
                    },
                    success: function (result, state, xhr) {
                        if (result == "success") {
                            $("#editaccount").html("<strong style='color: #1e97f7'>银行账号已存在</strong>");
                            chechnumber = true;
                        } else {
                            $("#editaccount").html("<strong style='color: #1e97f7'>正确</strong>")
                        }
                    },
                    dataType: "text"
                })
            } else {
                $("#editaccount").html("<strong style='color: red'>此银行账号错误</strong>")
            }
        });
    });
    //验证期初余额
    var beg=false;
    $("#beginbalance").on("blur",function () {
        var beginbalance=$("#beginbalance").val();
        var reg=/[0-9]/;
        var b=reg.test(beginbalance);
        if(b){
            $("#editbgbalance").html("<strong style='color: #1e97f7'>输入正确</strong>")
            beg=true;
        }else{
            $("#editbgbalance").html("<strong style='color: red'>格式错误</strong>")
        }
    });
    //验证账户余额
    var zhang=false;
    $("#zhangbalance").on("blur",function () {
        var zhangbalance=$("#zhangbalance").val();
        var reg=/[0-9]/;
        var b=reg.test(zhangbalance);
        if(b){
            $("#editzhbalance").html("<strong style='color: #1e97f7'>输入正确</strong>")
            zhang=true;
        }else{
            $("#editzhbalance").html("<strong  style='color: red'>格式错误</strong>")
        }
    });
    layui.use(['form','jquery','laydate'],function (data) {
        var $=layui.jquery;
        var form=layui.form;
        var laydate=layui.laydate;
        var flag = $("#sysData").val();
        var selectflag = function () {
            if (flag == '禁用') {
                $("input[name='sysData']").attr("checked", false);
            }
            if (flag == '正常') {
                $("input[name='sysData']").attr("checked", true);
            }
        }
        selectflag();
        form.render();
        form.on('switch(switchTest)', function () {
            if(this.checked ? 'true':'false' == 'true'){
                layer.confirm('你确定要启用吗？', {
                    btn: ['是', '否']
                }, function (index) {
                    var sel = document.getElementById("sysData");
                    sel.setAttribute("value", "正常");
                    layer.close(index);
                })
            } else {
                layer.confirm('你确定要停用吗？', {
                    btn: ['是', '否']
                }, function (index) {
                    var sel = document.getElementById("sysData");
                    sel.setAttribute("value", "禁止");
                    layer.close(index);
                })
            }
        })
    })
</script>
</body>
</html>